<script setup>
import Wsocket from "@/utils/Wsocket.js";
import { onMounted, onUnmounted, reactive } from "vue";

const wsMessage = new Wsocket();
let timer = null;
const data = reactive({
  num: 0,
  msg: '等待...',
});

onMounted(() => {
  timer = setInterval(() => {
    wsMessage.send({event: 'get_unread_message', data: data.num});
  }, 5000);
  wsMessage.on('get_unread_message', (res) => {
    data.num = res.data;
    data.msg = res.msg;
  });
});
onUnmounted(() => {
  clearInterval(timer);
  wsMessage.close();
});
</script>

<template>
<div>num:{{data.num}}</div>
<div>message:第{{data.num}}次{{data.msg}}</div>
</template>

<style scoped>

</style>
